<style lang="scss">
  @import "~@/styles/base";
  .page {
    height: 100vh;
    .page-bind {
      background-color: #fff;
      border-radius: rpx(10);
      min-height: 100%;
      padding-top: rpx(193);
      .icon-loading {
        display: block;
        margin-left: auto;
        margin-right: auto;
        width: rpx(201);
        height: rpx(201);
      }
      .count-dowm {
        padding-top: rpx(85);
        color: $main-color;
        font-size: rpx(40);
        line-height: rpx(54);
        text-align: center;
      }
      .tip {
        margin-top: rpx(98);
        font-size: rpx(34);
        color: $black;
        text-align: center;
        line-height: rpx(54);
      }
      .desc, .link-tip {
        color: $light-black;
        font-size: rpx(24);
        line-height: rpx(54);
        text-align: center;
      }
      .link-tip {
        @include middle-center-x();
        bottom: rpx(150);
        width: 100%;
      }
    }
  }
</style>
<template>
  <div class="page">
    <div class="page-bind">
      <img :animation="animationData" class="icon-loading" src="/static/img/bind/loading.png">
      <div class="count-dowm">{{countdown}}S</div>
      <div class="tip">设备连接中</div>
      <div class="desc">
        正在努力的连接智能设备，请耐心等候...
      </div>
      <div class="link-tip">
        手机配置设备需要60-120s时间，请耐心等待
      </div>
    </div>
  </div>
</template>

<script>
  import wx from 'utils/wx'
  import {APP_ID, PRODUCT_SECRET, DEFAULT_PASSWORD, BUSINESS_BASE_API, WX_APP_ID} from 'config'
  export default {
    data() {
      return {
        isIos: /iOS/.test(App.systemInfo.system),
        animationData: {},
        timeout: 90,
        countdown: 0,
        animationReg: 1,
      }
    },
    components: {},
    methods: {
        async bindWifi(){
          App.currentWifi = {
            ssid: 'HUAWEI-YU9TXX',
            password: 'XiaoQiu0617'
          }
          this.granwinAPPlugin = requirePlugin('GranwinAP');
          this.granwinAPPlugin.bindWifi({
            ssid: App.currentWifi.ssid,
            password: App.currentWifi.password,
            timeout: this.timeout,
            user_token: Store.state.login.token,
            app_id: APP_ID,
            product_secret: PRODUCT_SECRET,
            deviceSSID: App.deviceiSSID, //模块的wifi ssid 用于android切换
            deviceSSIDPwd: DEFAULT_PASSWORD, //模块的wifi 密码
            process: countdown => {
              console.info('countdown:', countdown)
              this.countdown = countdown;
            },
            success: async device => {
              wx.hideLoading();
              console.info('success:', device)
              wx.showLoading('正在绑定设备...')
              const result = await wx.request({
                method: 'POST',
                url: `${BUSINESS_BASE_API}/QSLightApi/bindDevice`,
                data: {
                  mac: device.mac,
                  appid: WX_APP_ID,
                  userid: App.userInfo.user.userid,
                }
              });
              wx.hideLoading();
              if(result.ret === 0){
                App.currentDevice = device;
                wx.redirectTo({ url: '/bind/pages/success/main' })
              }else{
                wx.showToast(result.message)
              }
            },
            fail: result => {
              console.info('fail:', result)
              wx.redirectTo({ url: '/bind/pages/fail/main' })
            }
          })
        }
    },
    onHide() {
      clearInterval(this.animationTask);
      this.granwinAPPlugin.destory();
    },
    async onShow() {
      if (!Store.getters.is_login) {
        await Store.dispatch('login');
      }
      if(this.isIos){
        this.timeout = 120;
      }
      this.countdown = this.timeout;
      const animation = wx.createAnimation({
        duration: 1500,
        timingFunction: 'linear',
      })
      animation.export()
      animation.rotate(360*this.animationReg++).step()
      this.animationData = animation.export();
      this.animationTask = setInterval(() => {
        animation.rotate(360*this.animationReg++).step()
        this.animationData = animation.export();
      }, 1500)
      this.bindWifi();
    },
  }
</script>
